<template>
	<view class="nav">
		<view class="nav-choose">
			<view :class="navClick === 1? 'active' : ''" @click="navClick = 1">临床表现</view>
			<view :class="navClick === 2? 'active' : ''" @click="navClick = 2">体温检测</view>
			<view :class="navClick === 3? 'active' : ''" @click="navClick = 3">化验检查</view>
			<view :class="navClick === 4? 'active' : ''" @click="navClick = 4">用药</view>
		</view>
		<view class="nav-body">
			<clinical :info="info" :clientId="clientId" :doctorId="doctorId" :setId="setId" v-show="navClick === 1"
				@nextStep="nextStep"></clinical>
			<temperature :info="info" :clientId="clientId" :doctorId="doctorId" :setId="setId" v-show="navClick === 2"
				@nextStep="nextStep" :navClick="navClick"></temperature>
			<bloodRoutine :info="info" :clientId="clientId" :doctorId="doctorId" :setId="setId" v-show="navClick === 3"
				@nextStep="nextStep"></bloodRoutine>
			<medication :info="info" :clientId="clientId" :doctorId="doctorId" :setId="setId" v-show="navClick === 4"
				@nextStep="nextStep"></medication>
		</view>

		<!-- 选择患者 -->
		<u-popup :show="chooseDialog" mode="center" bgColor="transparent" @close="close" :closeOnClickOverlay="false">
			<view class="dialog-box">
				<view class="dialog-header">
					<text style="font-size: 26rpx;font-weight: bold;color: #333;">选择就诊人</text>
					<!-- <u-icon name="close" @click="chooseDialog = false"></u-icon> -->
				</view>
				<view class="dialog-body">
					<!-- <view class="body-left">
						选择患者:
					</view> -->
					<view class="body-right">
						<u-radio-group v-model="clientId" placement="column">
							<u-radio style="margin-top: 15rpx;" shape="circle" activeColor="#54b6ab" labelSize="26rpx"
								:name="item.id" @change="changeClient" :label="item.realName"
								v-for="(item,index) in clientList" :key="index"></u-radio>
						</u-radio-group>
					</view>
				</view>
				<view class="dialog-footer">
					<view class="footer-btn" style="border-right: 2rpx solid #ccc;">
						<u-button type="default" text="取消" @click="cancel"></u-button>
					</view>
					<view class="footer-btn">
						<u-button type="default" text="确定" @click="submitClient"></u-button>
					</view>
				</view>
			</view>
		</u-popup>

		<!-- <u-loading-page :loading="loading" loading-text="正在努力加载中" bg-color="#e8e8e8"></u-loading-page> -->

	</view>
</template>

<script>
	import clinical from '@/components/clinical.vue'
	import bloodRoutine from '@/components/bloodRoutine.vue'
	import medication from '@/components/medication.vue'
	import temperature from '@/components/temperature.vue'
	export default {
		components: {
			clinical,
			bloodRoutine,
			medication,
			temperature
		},
		onShow() {
			this.getInfo()
			this.setId = uni.getStorageSync('setRecordId')
			uni.removeStorageSync('setRecordId')
			if (this.setId) {
				this.findById(this.setId)
				this.navClick = 2
				return false
			}
			// this.info=this.$store.state.form
			// this.doctorId = uni.getStorageSync('doctorId')
			this.findAllClient()
			
		},
		// watch: {
		// 	// "$store.state.form": function(val, oldval) {
		// 	// 	this.info=val
		// 	// },
		// 	//  immediate: true,

		// 	"$store.state.form": {
		// 		handler(newVal, oldVal) {
		// 			this.info = newVal
		// 		},
		// 		// immediate: true,
		// 		deep: true
		// 	}
		// },
		watch: {
			"$store.state.websocketData":{
				handler(newVal, oldVal) {
					this.userInfo.notReadCount=this.userInfo.notReadCount+1
					if(this.userInfo.notReadCount==0){
						uni.removeTabBarBadge({
							index:2
						})	
					} else {
						uni.setTabBarBadge({
							index: 2,
							text: this.userInfo.notReadCount+''
						})
					}
				},
			},
		
			// clientInfo:{
			// 	handler(newVal,oldVal){
			// 		console.log('编号了', this.form2.feverDayNum)
			// 		this.$store.commit('setInterrogationInfo', this.form2)
			// 	},
			// 	immediate: true,
			// 	deep: true
			// }
		},
		mounted() {
			// this.findNotSubmit()
			this.info=this.$store.state.form
			// this.changeTabName(this.$store.state.clientInfo.realName)
		},
		data() {
			return {
				info: null,
				navClick: 1,
				chooseDialog: false,
				clientList: [],
				clientInfo: null,
				chooseClientId: null,
				clientId: null,
				doctorId: null,
				loading: false,
				userInfo:{},
				setId: null,
				form3: {
					clientId: null,
					doctorId: null,
					morbidityCondition: 0, //发病情况 0初诊 1复诊
					timesNum: null, //复诊次数 初诊不填 复诊必填
					morbidityTime: null, //发病时间 初诊必填 复诊非必填
					feverDayNum: null, //发热天数
					highTemperature: null, //发热最高温度
					feverSymptom: 0, //发热症状 0无 1有
					symptomDetailArr: [], //发热症状详情
					feverTimeInterval: 0, //发热时间间隔 0持续发热 1间隔
					intervalTimeHour: null, //间隔小时
					feverMedicateStatus: 0, //发热用药 0无 1有
					medicateDetail: null, //用药详情
					heelExampleUrlArr: [], //足跟示例资源地址
					heelExampleType: null, //足跟示例资源类型 0图片 1视频
					heelColor: null, //足跟颜色
					heelTemperature: null, //足跟温度 1温 2凉 3热
					heelPressRedTime: null, //足跟按压变红 0 <=3秒  1>3秒
					heelHardness: null, //足心软硬度 1软(唇) 2韧(鼻) 3硬(额)
					coughDayNum: null, //咳嗽天数
					aggravateDayNum: null, //加重天数
					coughTimesArr: [], //咳嗽时间
					coughRelatedFactor: 0, //咳嗽相关因素0无 1有
					coughFactorDetailArr: [], //咳嗽相关因素详情
					coughVomitStatus: 0, //咳嗽呕吐 0无 1有
					coughAwakeningStatus: 0, //夜里咳醒 0无 1有
					feverCoughStatus: 0, //发热咳嗽 0无 1有
					coughPeculiarityArr: [], //咳嗽特点
					coughRecordedUrl: null, //咳嗽录音 可上床多条 用,隔开
					coughRecordedUrlArr: [], //咳嗽录音数组
					gaspStatus: 0, //喘息 0无 1有
					gaspDayNum: null, //喘息天数
					sneezeStatus: 0, //喷嚏 0无 1有
					sneezeDayNum: null, //喷嚏天数
					nasalObstructionStatus: 0, //鼻塞 0无 1有
					nasalObstructionDayNum: null, //鼻塞天数
					anginaStatus: 0, //咽痛 0无 1有
					anginaDayNum: null, //咽痛天数
					dullStatus: 0, //暗哑 0无 1有
					dullDegree: 1, //暗哑程度 1轻 2中 3重
					gaspBreathVideoUrlArr: [], //喘息或呼吸困难视频示例地址
					electronicStethoscopeUrlArr: [], //电子听诊器呼吸音地址
					kneadNoseEye: 0, //手揉鼻子眼睛 0无 1有
					eczemaStatus: 0, //幼时湿疹 0无 1有
					eczemaDegree: 1, //湿疹程度 1轻 2中 3重
					allergyRhinitis: 0, //过敏性鼻炎 0无 1有
					parentAllergyRhinitis: 0, //父母过敏性鼻炎 0无 1有
					allergySource: 0, //过敏原 0无 1有
					allergySourceDetail: null, //过敏原详情
					penicillinCephalosporinAllergy: 0, //青霉素/头孢过敏史 0无 1有
					otherAllergyMedicineDetail: null, //其他过敏药物
					foodAllergyMedicineDetail: null, //食物过敏详情
					recentRash: 0, //近两天皮疹 0无 1有
					lowerPartRash: 0, //下面部位皮疹 0无 1有
					lowerPartRashDetailArr: [], //下面部位皮疹详情
					rashShowType: null, //皮疹展示 0图片 1视频
					rashShowUrlArr: [], //皮疹展示资源地址
					otherExpression: 0, //有无下列表现 0无 1有
					otherExpressionDetailArr: [], //有下列表现详情
					otherIllness: 1, //其他疾病
					otherIllnessDetail: null, //其他疾病详情
					temperatureCheckArr: [],
					electronicTemperatureUrlArr: [],
					physicalAssayImageArr: [], //血常规详情
					physicalUrineReportArr: [], //尿常规详情
					chestRadiograph: 0, //是否有胸片
					chestRadiographArr: [], //胸片详情
					lungCt: 0, //是否有肺部CT
					lungCtArr: [], //肺部CT详情
					carbonMonoxideArr: [], //一氧化碳检测详情
					lungFeature: 0, //是否有肺功能
					lungFeatureArr: [], //肺功能检测详情
					bronchus: 0, //是否有支气管检查
					bronchusArr: [], //支气管检查详情
					illDayNum: null,
					takeOrallyArr: [],
					intravenousDripArr: [],
					atomizationArr: [],
					otherMedicalHistoryArr: [] //图片和pdf都支持
				},
				form: {
					morbidityCondition: 0, //发病情况 0初诊 1复诊
					timesNum: null, //复诊次数 初诊不填 复诊必填
					morbidityTime: null, //发病时间 初诊必填 复诊非必填
					feverDayNum: null, //发热天数
					highTemperature: null, //发热最高温度
					feverSymptom: 0, //发热症状 0无 1有
					symptomDetailArr: [], //发热症状详情
					feverTimeInterval: 0, //发热时间间隔 0持续发热 1间隔
					intervalTimeHour: null, //间隔小时
					feverMedicateStatus: 0, //发热用药 0无 1有
					medicateDetail: null, //用药详情
					heelExampleUrlArr: [], //足跟示例资源地址
					heelExampleType: null, //足跟示例资源类型 0图片 1视频
					heelColor: null, //足跟颜色
					heelTemperature: null, //足跟温度 1温 2凉 3热
					heelPressRedTime: null, //足跟按压变红 0 <=3秒  1>3秒
					heelHardness: null, //足心软硬度 1软(唇) 2韧(鼻) 3硬(额)
					coughDayNum: null, //咳嗽天数
					aggravateDayNum: null, //加重天数
					coughTimesArr: [], //咳嗽时间
					coughRelatedFactor: 0, //咳嗽相关因素0无 1有
					coughFactorDetailArr: [], //咳嗽相关因素详情
					coughVomitStatus: 0, //咳嗽呕吐 0无 1有
					coughAwakeningStatus: 0, //夜里咳醒 0无 1有
					feverCoughStatus: 0, //发热咳嗽 0无 1有
					coughPeculiarityArr: [], //咳嗽特点
					coughRecordedUrl: null, //咳嗽录音 可上床多条 用,隔开
					coughRecordedUrlArr: [], //咳嗽录音数组
					gaspStatus: 0, //喘息 0无 1有
					gaspDayNum: null, //喘息天数
					sneezeStatus: 0, //喷嚏 0无 1有
					sneezeDayNum: null, //喷嚏天数
					nasalObstructionStatus: 0, //鼻塞 0无 1有
					nasalObstructionDayNum: null, //鼻塞天数
					anginaStatus: 0, //咽痛 0无 1有
					anginaDayNum: null, //咽痛天数
					dullStatus: 0, //暗哑 0无 1有
					dullDegree: 1, //暗哑程度 1轻 2中 3重
					gaspBreathVideoUrlArr: [], //喘息或呼吸困难视频示例地址
					electronicStethoscopeUrlArr: [], //电子听诊器呼吸音地址
					kneadNoseEye: 0, //手揉鼻子眼睛 0无 1有
					eczemaStatus: 0, //幼时湿疹 0无 1有
					eczemaDegree: 1, //湿疹程度 1轻 2中 3重
					allergyRhinitis: 0, //过敏性鼻炎 0无 1有
					parentAllergyRhinitis: 0, //父母过敏性鼻炎 0无 1有
					allergySource: 0, //过敏原 0无 1有
					allergySourceDetail: null, //过敏原详情
					penicillinCephalosporinAllergy: 0, //青霉素/头孢过敏史 0无 1有
					otherAllergyMedicineDetail: null, //其他过敏药物
					foodAllergyMedicineDetail: null, //食物过敏详情
					recentRash: 0, //近两天皮疹 0无 1有
					lowerPartRash: 0, //下面部位皮疹 0无 1有
					lowerPartRashDetailArr: [], //下面部位皮疹详情
					rashShowType: null, //皮疹展示 0图片 1视频
					rashShowUrlArr: [], //皮疹展示资源地址
					otherExpression: 0, //有无下列表现 0无 1有
					otherExpressionDetailArr: [], //有下列表现详情
					otherIllness: 1, //其他疾病
					otherIllnessDetail: null, //其他疾病详情
					temperatureCheckArr: [],
					physicalAssayImageArr: [], //血常规详情
					physicalUrineReportArr: [], //尿常规详情
					chestRadiograph: 0, //是否有胸片
					chestRadiographArr: [], //胸片详情
					lungCt: 0, //是否有肺部CT
					lungCtArr: [], //肺部CT详情
					carbonMonoxideArr: [], //一氧化碳检测详情
					lungFeature: 0, //是否有肺功能
					lungFeatureArr: [], //肺功能检测详情
					bronchus: 0, //是否有支气管检查
					bronchusArr: [], //支气管检查详情
					illDayNum: null,
					takeOrallyArr: [],
					intravenousDripArr: [],
					atomizationArr: [],
					otherMedicalHistoryArr: [] //图片和pdf都支持
				},
				
			};
		},
		onNavigationBarButtonTap(e) { //点击事件
			this.chooseDialog = true
		},
		methods: {
			//获取个人信息
			async getInfo() {
				const {
					data
				} = await uni.$http.post('/user/getUserInfo')
				if (data.code === 200) {
					this.userInfo = data.data
					// this.clientList = this.userInfo.clientList
					if(this.userInfo.notReadCount==0){
						uni.removeTabBarBadge({
							index:2
						})	
					} else {
						uni.setTabBarBadge({
							index: 2,
							text: this.userInfo.notReadCount+''
						})
					}
				}
			},
			cancel() {
				uni.switchTab({
					url: '/pages/my'
				})
				this.chooseDialog = false
			},
			//选择就诊人
			submitClient() {
				if (!this.chooseClientId) {
					// this.chooseClientId = this.clientList[0].id
					return uni.showToast({
						icon: 'none',
						title: '请选择就诊人'
					})
				}
				
				for (var i = 0; i < this.clientList.length; i++) {
					if (this.clientList[i].id === this.chooseClientId) {
						this.clientInfo = this.clientList[i]
						break;
					}
				}
				this.form3.coughRecordedUrlArr = []
				this.form3.temperatureCheckArr = []
				this.form = Object.assign({}, this.form3);
				this.$store.commit('setInterrogationInfo',this.form)
				this.info = this.form
				this.$store.commit('setInterrogationClientInfo',this.clientInfo)
				this.changeTabName(this.clientInfo.realName)
				this.chooseDialog = false
			},
			changeClient(clientId) {
				//就诊人信息
				this.chooseClientId = clientId
				// for (var i = 0; i < this.clientList.length; i++) {
				// 	if (this.clientList[i].id === this.chooseClientId) {
				// 		this.clientInfo = this.clientList[i]
				// 		break;
				// 	}
				// }
				
				// this.changeTabName(this.clientInfo.realName)
				// this.chooseDialog = false
			},
			//查询当前用户添加的患者信息
			async findAllClient() {
				const {
					data
				} = await uni.$http.post('/patient-client/findAll')
				if (data.code === 200) {
					this.clientList = data.data
					if (!this.clientList || this.clientList.length == 0) {
						//  uni.navigateTo({
						// 	url:'/pages/addVisitor'
						// })
						return uni.showToast({
							icon: 'none',
							title: '请先添加就诊人'
						})
					}
					
					if(!this.$store.state.form.clientId){
						this.changeTabName('请选择就诊人')
						this.chooseDialog=true
					} else {
						for (var i = 0; i < this.clientList.length; i++) {
							if (this.clientList[i].id === this.$store.state.form.clientId) {
								
								this.changeTabName(this.clientList[i].realName)
								this.$store.commit('setInterrogationClientInfo',this.clientList[i])
								break;
							}
						}
						
					}
					
				}
			},
			//组件传回来进行下一步按钮操作
			nextStep(val) {
				this.navClick = val
			},
			// 关闭弹窗
			close() {
				this.chooseDialog = false
				// console.log('close');
			},
			//切换tarbar内容
			changeTabName(name) {
				if (!name) {
					return false
				}
				// #ifdef APP-PLUS
				let pages = getCurrentPages();
				let page = pages[pages.length - 1];
				let currentWebview = page.$getAppWebview();
				let tn = currentWebview.getStyle().titleNView;
				//修改按钮文本文本
				tn.buttons[0].text = name;
				tn.buttons[0].width="auto"
				currentWebview.setStyle({
					titleNView: tn
				});
				// #endif

			},
			//查询已提交的详情
			async findById(id) {
				const {
					data
				} = await uni.$http.post('/doctor-interrogationRecords/findById?id=' + id)
				if (data.code === 200) {
					this.clientId = data.data.clientId
					this.info = data.data
					// uni.setStorageSync('interrogationRecords', JSON.stringify(data.data))

					for (var i = 0; i < this.clientList.length; i++) {
						if (this.clientList[i].id === this.clientId) {
							this.clientInfo = this.clientList[i]
							break;
						}
					}
					this.changeTabName(this.clientInfo.realName)
				}
			},
			//查询是否有未提交的记录
			async findNotSubmit() {
				const {
					data
				} = await uni.$http.post('/patient-interrogationRecords/findNotSubmit')
				if (data.code === 200) {
					if (data.data !== null || data.data) {
						this.clientId = data.data.clientId
						this.info = data.data

						for (var i = 0; i < this.clientList.length; i++) {
							if (this.clientList[i].id === this.clientId) {
								this.clientInfo = this.clientList[i]
								break;
							}
						}
						this.changeTabName(this.clientInfo.realName)

					} else {
						this.info = this.form
						this.changeTabName("")
						this.chooseDialog = true
					}
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.nav {
		width: 100%;
		height: 100%;
		background-color: #f2f2f2;

		.nav-choose {
			// margin-top: 20rpx;
			width: 100%;
			height: 80rpx;
			margin-bottom: 20rpx;
			box-sizing: border-box;
			background-color: #fff;
			display: flex;
			justify-content: space-around;
			align-items: center;

			view {
				height: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				box-sizing: border-box;
				transition: all .5s;
			}
		}

		.active {
			color: #54b6ab;
			border-bottom: 6rpx solid #54b6ab;
		}

		.nav-body {
			width: 100%;
			height: calc(100% - 100rpx);
			padding: 10rpx 20rpx;
			box-sizing: border-box;
		}

		.dialog-box {
			width: 80vw;
			background-color: #fff;
			border-radius: 20rpx;

			.dialog-header {
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 20rpx 30rpx;
				box-sizing: border-box;
				border-bottom: 2rpx solid #ccc;
			}

			.dialog-body {
				width: 100%;
				padding: 50rpx 30rpx;
				box-sizing: border-box;
				border-bottom: 2rpx solid #ccc;
				display: flex;
				align-items: stretch;
				justify-content: center;

				.body-left {
					width: initial;
					text-align: center;
				}

				.body-right {
					width: 30%;
					margin-left: 20rpx;
				}
			}

			.dialog-footer {
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;

				.footer-btn {
					width: 50%;
				}
			}
		}
	}
</style>